.lotter-res-contain{
    &.lotter-res-open{
        transform: translate(0);
        right: 0;
    }
    .l-res-open{
        border-radius: 50px;
        position: absolute;
        left: -164px;
        bottom: 80px;
        padding: 0;
        height: 54px;
        line-height: 54px;
        width: 54px;
        text-align: center;
        display: block;
        box-shadow: 0 0.46875rem 2.1875rem rgba(4,9,20,0.03), 0 0.9375rem 1.40625rem rgba(4,9,20,0.03), 0 0.25rem 0.53125rem rgba(4,9,20,0.05), 0 0.125rem 0.1875rem rgba(4,9,20,0.03);
        margin-top: -27px;
        cursor: pointer;
        color: #212529;
        text-align: center;
        i{
            font-size: 2.5rem; display: inline-block; width: 40px; height: 40px; margin-left: 2px; margin-top: 6px;
        }
    }
    .lotter-res-inner{
        background: #fff;
        width: 445px;
        height: 100vh;
        padding: 0;
        .lotter-res-i{
            width: 100%;
            height: 100%;
            .result-table{
                .ps__rail-y{ //scroll插件的滚动条的强制设置
                    top: 110px !important;
                }
            }
            .l-res-tab-contain{
                margin-top: 0px;
                height: 61px;
                border-bottom: 1px solid #dee2e6;
                .content-tab{
                    padding-left: 20px;
                    >ul{
                        padding: 3px 0px;
                    }
                }
                .l-res-tab-item{
                    margin-top: 2px;
                }
                .l-res-tab-item.report{
                    .re-header{
                        height: 50px; line-height: 50px; background: #fbfbfb;
                        border-bottom: 1px solid #e6e6e6; display: flex;justify-content: space-between;
                        &.one{
                            .re-h-left{
                                color: #c34350;
                            }
                        }
                        &.two{
                            border-top: 1px solid #e6e6e6;
                            .re-h-left{
                                color: #4ab8c7;
                            }
                        }
                        font-size: 1.1rem;
                        .re-h-left{
                            i{
                                padding: 0px 10px;
                            }
                        }
                        .re-h-right{
                            cursor: pointer;
                        }
                    }
                    .wlh-report-ul{
                        margin: 0px; padding: 0px;  background: #f9f9f9;
                        &.wlh-w-report{
                            li:last-child{
                                border-bottom: none;
                            }
                            .money{
                                color: #c34350;
                            }
                            .msg{
                                height: 30px; line-height: 30px; padding: 0px 20px; border-radius: 30px; border: 1px solid #dfdfdf; display: inline-block;
                            }
                        }
                        &.wlh-f-report{
                            margin: 0px 0px 50px 0px;
                            .money{
                                color: #000;
                            }
                            .money-red{
                                color: #ff1717;
                            }
                            .money-green{
                                color: #14d014;
                            }
                        }
                        li{
                            height: 50px; border-bottom: 1px solid #efefef; list-style: none; background: #fff;
                            &:first-child{
                                >span{
                                    margin-top: 12px; 
                                }
                            }
                           > span{
                                font-size: 1rem; display: inline-block; width: 108px; text-align: center; vertical-align: middle;
                                &.l-span-first{
                                    margin: 0px;
                                    p{
                                        font-size: 12px; margin-top: 5px;
                                    }
                                }
                                &.l-span-second{
                                    height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
                                    &.noBar{
                                        line-height: 50px;
                                    }
                                }
                                p{
                                    padding: 0px; margin: 0px;
                                }
                            }
                        }
                    }
                    .report-innner{
                        position: relative; width: 100%; height: 100%;
                        .report-i-f,.report-i-d{
                            width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden;
                            &::-webkit-scrollbar{
                                width: 10px;height: 1px;
                            }
                            &::-webkit-scrollbar-thumb{
                                border-radius: 10px;
                                background: #f5f5f5;
                            }
                            &::-webkit-scrollbar-track{
                                background: #fff;
                            }
                        }
                        .re-header{
                            position: fixed; width: 100%; z-index: 100;
                        }
                        .report-doing,.report-finish{
                            margin-top: 50px;
                        }
                        .report-total{
                            height: 50px; line-height: 50px; width: 100%; position: absolute;bottom: 0px; background: #fff; z-index: 10;  border-top: 1px solid #efefef;
                            >ul{
                                margin: 0px; padding: 0px;
                                >li{
                                    list-style: none; height: 50px; line-height: 50px; 
                                    span{
                                        width: 108px; display:inline-block; text-align: center; font-size: 1rem;
                                        &.money-red{
                                            color: #ff1717;
                                        }
                                        &.money-green{
                                            color: #14d014;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .wlh-report-empty{
                        text-align: center;
                        p{
                            font-size: 1rem;
                        }
                    }
                }
                //长龙
                .l-res-tab-item.changlong{
                    .cl-header{
                        text-align: right; padding: 20px;
                        span{
                            display: inline-block; margin-left: 10px;
                        }
                        .cl-header-select{
                            select{
                                width: 60px; height: 30px; outline: none; border: 1px solid #cacbd1; text-align: center; padding-left: 10px; border-radius: 5px;
                            }
                        }
                        .cl-header-refresh{
                            width: 50px;   text-align: center;  border: 1px solid #d9d9d9; border-radius: 50px; color: #5078e0; padding: 2px 0px; cursor: pointer;
                        }
                    }
                    .cl-inner{
                        width: 405px; margin: 0px auto;  
                        .cl-item{
                            border: 1px solid #dbe0e4; margin-bottom: 20px; border-radius: 10px; height: 185px;  cursor: pointer; position: relative;
                            .mask{
                                display: none;
                            }
                            &.disable{
                                .mask{
                                    display: block;background: rgba(0,0,0,0.4); position: absolute; top: 0px; width: 100%; height: 100%;border-radius: 10px; left: 0px; z-index: 10;
                                    text-align: center;
                                    span{
                                        margin-top: 80px; color: #fff; display: inline-block;
                                    }
                                }
                            }
                            .cl-i-header{
                                height: 40px; border-bottom: 1px solid #dbe0e4 ; background: #f7f7f7;
                                border-radius: 10px 10px 0px 0px; position: relative;
                                .cl-i-h-left{
                                    float: left; margin-left: 20px; margin-top: 8px;
                                }
                                .cl-i-h-right{
                                    float: right; margin-right: 20px; margin-top: 8px;
                                }
                            }
                            .cl-i-kj{
                                height: 30px; margin: 15px 0px;padding: 0px 20px;position: relative;
                                .cl-i-k-left{
                                    float: left; margin-top: 4px;
                                }
                                .cl-i-k-right{
                                    float: right;
                                    span{
                                        display: inline-block; border: 1px solid #e0e0e0; padding: 4px 10px; border-radius: 5px; margin-left: 10px;
                                        &.active{
                                            border: 1px solid #3f6ad8; background: #3f6ad8; color: #fff;
                                        }
                                    }
                                }
                            }
                            .cl-i-pk-rate{
                                padding: 0px 20px; height: 30px;position: relative; margin-bottom: 15px;
                                .cl-i-pk-left{
                                    float: left;
                                }
                                .cl-i-pk-right{
                                    float: right;
                                }
                                .cl-i-line{
                                    position: absolute; bottom: 0px; width: 363px;
                                }
                                .cl-i-line-c{
                                    height: 5px; background: #6499ef; border-radius: 5px; position: relative;
                                    .line-val{
                                        height: 5px; width: 30%; position: absolute; background: #ff6464; border-radius: 5px; top: 0px;
                                    }
                                    .line-pk-msg{
                                        background: #5f6266; color: #fff; border-radius: 3px 3px 0px 0px; position: absolute; bottom: 0px; padding: 0px 4px; margin-left: -10px; left: 30%;
                                    }
                                }
                            }
                            .cl-i-res{
                                padding: 0px 20px; position: relative;
                                span{
                                    display: inline-block; color: #999;
                                    &.r-v{
                                        height: 20px; border-radius: 20px; border: 1px solid #999; padding: 0px 2px; margin-right: 8px; line-height: 18px;
                                    }
                                }
                            }
                        }
                    }
                    .ps__rail-y{
                        top: 60px !important;
                    }
                }
            }
        }
        //开奖结果
        .result-table{
            width: 100%; 
            >ul{
                margin: 0px; padding: 50px 0px 0px 0px;
            }
            >ul>li{
                 border-bottom: 1px solid #e9ecef; list-style: none; display: flex; height: 50px; align-items: center;
                >ol{
                    display: inline-block; text-align: left; color: #666; font-size: 12px; padding: 0px; margin: 0px;
                    >li{
                        display: inline-block; border: none; 
                        &.balls_pk { 
                            p{
                                width: 24px; height: 24px; text-align: center; line-height: 24px; margin-right: 2px;
                            }
                         }
                         p.lotball,p.blueball,p.redball,p.greenball{   
                            width: 24px; height: 24px; text-align: center; line-height: 24px; margin-right: 2px;
                         }
                    }
                    p{
                        display: inline-block; padding: 0px;  margin: 0px;
                    }
                    &.cycleid { width: 100px !important; text-align: center; }
                    &.sdate { width: 50px; text-align: center; margin: 0px 10px; }
                    &.dx,&.ds,&.sum,&.tm,&.zh,&.bsl{
                        display: none; width: calc(100% - 160px);
                    }
                    &.sum{
                        li.balls_bottom p { 
                            margin-right: 2px; height: 24px; line-height: 24px; padding: 0px 6px; border-radius: 3px; color: #fff; font-weight: bold;
                            &.l,&.d{
                                background: #7f8ab0;
                            }
                            &.h,&.x,&.s{ 
                                background: #f68407;
                            }
                            &.draw{
                                background: #d7d7d7;
                            }
                            &.wd{
                                color: #f68407;
                            }
                            &.wx{
                                color: #7f8ab0;
                            }
                            &.s3{
                                color: #2fa8e9;
                            }
                            &.zz6{
                                color:inherit;
                            }
                            &.ddz{
                                color: #f68407;
                            }
                            &.s2{
                                color: #7f8ab0;
                            }
                            &.bz{
                                color: #ea3531;
                            }
                            &.t{
                                color: inherit;
                            }
                            &.he{
                                background: #a9d18e;
                            }
                        }
                        li.balls_bottom p:first-child { width: 20px; text-align: center; padding: 0px; color: #ea3531; }
                        //六合彩的特殊处理
                        >li.sum_sum{
                            color: #ea3531 !important; width: 34px; margin-right: 2px; text-align: center;font-weight: bold;
                        }
                        >li.sum_ds,>li.sum_dx{
                            margin-right: 2px;height: 24px;line-height: 24px;padding: 0px 6px;border-radius: 3px;color: #fff;font-weight: bold;
                            &.sum_ddx,&.sum_dds{background: #7f8ab0;}
                            &.sum_dxx,&.sum_dss{background: #f68407;}
                        }
                        >li.labelsebo{
                            span{margin-right: 2px;height: 24px;line-height: 24px;padding: 0px 6px;border-radius: 3px;color: #fff;font-weight: bold; display: inline-block;}
                            span.sbred{
                                background: #bc0900;
                            }
                            span.sbblue{
                                background: #5956ce;
                            }
                            span.sbgreen{
                                background: #f68407;
                            }
                        }
                    }
                    &.ds li,&.dx li{  
                        width: 24px; height: 24px; text-align: center; line-height: 24px; margin-right: 2px; border-radius: 3px; color: #fff; font-weight: bold;
                        &.d{
                            background: #7f8ab0;
                        }
                        &.s,&.x{ 
                            background: #f68407;
                        }
                        &.draw{
                            background: #d7d7d7;
                        }
                    }
                    //六合彩的特码
                    &.tm{
                        >li{
                            margin-right: 2px;height: 24px;line-height: 24px;padding: 0px 6px;border-radius: 3px;color: #fff;font-weight: bold;
                            &.tmtm{
                                width: 24px; padding: 0px;  text-align: center;
                            }
                            &.tmsx{
                                color: inherit;
                            }
                            &.tmdd{
                                background: #7f8ab0;
                            }
                            &.tmxx{
                                background: #f68407;
                            }
                            &.tmhh{
                                background: #d7d7d7;
                            }
                        }
                    }
                    &.zh{
                        li{
                            width: 24px; height: 24px; text-align: center; line-height: 24px; margin-right: 2px; border-radius: 3px; color: #fff; font-weight: bold;
                            &.z{
                                background: #7f8ab0;
                            }
                            &.h{ 
                                background: #f68407;
                            }
                        }
                    }
                }
                &.th { 
                    background: #fff; position: fixed; top: 60px;width: 100%; border-top: 1px solid #e9ecef; z-index: 100; padding-top: 14px;
                    ol{
                        padding: .25rem .5rem;font-size: .8rem;line-height: 1.5;border-radius: .2rem;display: inline-block;text-decoration: none;font-weight: 400;text-align: center;vertical-align: middle;user-select: none;transition: color 0.15s,background-color 0.15s,border-color 0.15s,box-shadow 0.15s;
                        width: auto; margin: 10px 0px; cursor: pointer;
                        &.balls,&.ds,&.dx,&.sum{ margin-right: 10px;}
                        &.selected { background: #3f6ad8;  color: #FFF; }
                        &.sdate { width: 50px; text-align: center; margin-left: 10px; margin-right: 10px; }
                    }
                }
            }
            &.balls_ccq p { width: 30px; height: 30px; display: inline-block; border-radius: 5px; vertical-align: middle; }
        }

    }
}